<template>
  	<div id="app" class="page-wrapper" :class="{'bg-blue':bgBlue}">
  		<keep-alive>
		    <router-view :winH="winH" v-if="$route.meta.keepAlive"></router-view>
		</keep-alive>
		<router-view :winH="winH" v-if="!$route.meta.keepAlive"></router-view>
  	</div>
</template>
<script>
import { mapState } from 'vuex'
let ratio = 1920/1080
let resizeTimer = null
export default {
	computed: {
	},
	watch: {
		$route (to, from) {
			this.bgBlue = this.$route.path!='/' && this.$route.path!='/login' && this.$route.path!='/IOT'
		}
	},
	data () {
		return {
			winH: 500,
			zoom: 1,
			left: 0,
			top:0,
			bgBlue: this.$route.path!='/' && this.$route.path!='/login' && this.$route.path!='/IOT'
		}
	},
	methods: {
		setSize () {
			let winW = document.documentElement.clientWidth || document.body.clientWidth
			let winH = document.documentElement.clientHeight || document.body.clientHeight
			let winRatio = winW/winH
			let scale = winRatio<ratio? winW/1920 : winH/1080
			this.$store.commit('setScale',scale)
			this.$store.commit('setWinSize',{winW,winH})
			document.getElementsByTagName('html')[0].style.fontSize = (winRatio<ratio? 1 : ratio/winRatio) * winW / 10 + 'px';
			this.winH = winH
		},
		addHttpMeta() {
			const meta = document.createElement('meta');
			meta.httpEquiv = "Content-Security-Policy"
			meta.content = 'upgrade-insecure-requests'
			document.getElementsByTagName('head')[0].appendChild(meta)
		}
	},
	created () {
		this.setSize();
		let href = window.location.href
		// if(href.substr(0 , 5) == 'https'){
		// 	this.addHttpMeta()
		// }
	},
	mounted () {
		window.onresize = ()=>{
		    clearTimeout(resizeTimer);
		    resizeTimer = setTimeout(() => {
		        this.setSize()
		    }, 200)
		}
	}
}
</script>

<style lang="less">
@import './assets/css/fonts.less';
@import './assets/css/style.less';
</style>
